@import "common";
ul li{
    list-style: none;
}
.wrap{
    background: #f5f5f5;
}
.banner{
    font-size: 0;
    position: relative;
    >img{
        width: r(640px);
        height: r(321px);
       
    }
     .mask{
           
            width: r(640px);
            height: r(91px);
            position: absolute;
            bottom: 0;
            background: rgba(0,0,0,0.5);
            .text{
                color: white;
                 width: r(404px);
                height: r(30px);
                margin: {
                    top:r(16px);
                    left: r(28px);
                    bottom: r(8px);
                }
                .big{
                    font-size:r(26.63px) ;
                    
                }
               
            }
            .date-local{
                margin-left: r(28px);
                 font-size: 0;
                 width: r(420px);
                height: r(24px);
//              margin-top: r(52px);
                
                li{
                    float: left;
                    vertical-align: middle;
                   
                    >img{
                        width: r(24px);
                        height: r(24px);
                        margin-right: r(2px);
                        vertical-align: middle;
                    }
                   
                }
                color: white;
                 
                .date{
                   font-size: r(16px);
                   margin-right: r(16px);
                }
                .local{
                   
                    font-size: r(16px);
                   
                }
            }
        }
}
section{
    
    margin-top:r(25px) ;
    width: r(640px);
    height: r(1238px);
    font-size: 0;
    .list-contain{
        margin-bottom: r(25px);
        width: r(640px);
        height: r(608px);
        .list-item{
            margin: 0 auto;
            width: r(585px);
            height: r(608px);
           
            .touxiang{
                 width: r(58px);
                 height: r(58px);
                 background: #898989;
                 border-radius: 50%;
                 margin-top: r(27px);
                 margin-right: r(15px);
                 float: left;
            }
            .person{
                width: r(175px);
                float: left;
                margin-top: r(23px);
                margin-right: r(103px);
                color: $icon-color;
                .name{
                    font-size: r(28px);
                }
                .zhiwei{
                    font-size: r(18px);
                }
            }
            .yuye-btn{
                margin-top: r(27px);
                float: left;
                width: r(228px);
                height: r(58px);
                background: #b20000;
                color: white;
                text-align: center;
                line-height: r(58px);
                
                >p{
                    font-size: r(28.12px);
                }
            }
            .classify{
                width: r(575px);
                height: r(28px);
                margin-right: r(15px);
                margin-top: r(15px);
                margin-bottom: r(24px);
                .left{
                    font-size: r(24.86px);
                    margin-right: r(150px);
                }
                .right{
                    font-size: r(16px);
                    margin-top: r(10px);
                }
                
            }
            .lesson-img{
                width: r(582px);
                height: r(432px);
                >img{
                    width: r(582px);
                height: r(432px);
                }
            }
        }
    }
}
